<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title>酒店介绍</title>
  <link href="css/css.css" rel="stylesheet" type="text/css">
</head>

<body>
  <header>
    <div class="head_c">
      <!--头部-->
      <div class="top">
        <div class="top_left">欢迎光临悠游行！</div>
        <div class="top_right" style="display: flex;" id="login_signup_area">
          <div class="top_right"><a href="login.html">登录</a><a href="zhuce.html">注册</a></div>
        </div>
        <div class="top_right" style="display: flex;" id="logout_area">
          <a class="top_right" id="login_info" style="font-weight: bold;">用户：15159241643</a>
          <div class="top_right logout_button" onclick="logout()">退出登录</div>
        </div>
      </div>
    </div>
  </header>

  <!--导航-->
  <nav>
    <ul>
      <li><a href="index.html">网站首页</a></li>
      <li><a href="jingdian.html">著名景点</a></li>
      <li><a href="luxian.html">推荐路线</a></li>
      <li class="on"><a href="jiudian.html">酒店入住</a></li>
      <li><a href="luntan.html">论坛热帖</a></li>
       
    </ul>
  </nav>

  <!--banner-->
  <div class="banner"></div>


  <div class="jiudian_jieshao">

    <div class="price_font">
      <form action="" method="">
        <p style="font-size:18px;">填写预定信息</p>
        <p>联&nbsp;系&nbsp;&nbsp;人：<input type="text" value="" class="text" /></p>
        <p>身份证：<input type="text" value="" class="text" /></p>
        <p>预定时间：<input type="text" value="" class="text" /></p>
        <div class="fu">您已选择定制的套餐，请尽快付款！ &nbsp;&nbsp;&nbsp;&nbsp;应付金额： <span
            style=" color:red; font-size:20px">699.00</span></div>
        <p style="margin-top:20px;"><span style=" color:red;">网上支付</span>&nbsp;&nbsp;&nbsp;&nbsp;线下支付</p>
        <div class="box">
          <div class="line">银行卡支付</div>
          <div class="hang">
            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_03.jpg" /></div>

            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_06.jpg" /></div>

            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_09.jpg" /></div>

            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_11.jpg" /></div>
          </div>
          <div class="hang">
            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_17.jpg" /></div>
            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_18.jpg" /></div>
          </div>
          <div class="line">平台支付</div>
          <div class="hang">
            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_21.jpg" /></div>
            <div class="dan"><input type="radio" name="5" /></div>
            <div class="zhifu"><img src="images/1_23.jpg" /></div>
          </div>
        </div>
        <input type="submit" class="sub" value="提交订单" />

        <div class="modal-wrapper hidden">
          <div class="modal">
            <img src="images/dlcg.jpg" />
            <h2 style="width:100%; text-align:center; line-height:40px;">提交成功</h2>


          </div>
        </div>
      </form>

    </div>

    <div class="clears"></div>





  </div>





  <footer>悠游行</footer>
</body>

</html>
<script src="./js/utils.js"></script>
<script>
    display_login_info();
</script>